<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>响应式栅格简单实现</title>
    <link rel="stylesheet" href="tast.1.css"></link>
</head>
<body>
<div class="waper">
    <div class="outer col-md-4 col-sm-6">
        <div class="inner"></div>
    </div>
    <div class="outer col-md-4 col-sm-6">
        <div class="inner"></div>
    </div>
    <div class="outer col-md-4 col-sm-12">
        <div class="inner"></div>
    </div>
    <div class="outer col-md-3 col-sm-3">
        <div class="inner"></div>
    </div>
    <div class="outer col-md-3 col-sm-6">
        <div class="inner"></div>
    </div>
    <div class="outer col-md-3 col-sm-2">
            <div class="inner"></div>
    </div>
    <div class="outer col-md-3 col-sm-1">
            <div class="inner"></div>
    </div>


</div>
</body>
</html>